<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <link rel="stylesheet" href="css/user/public.css">
    <link rel="stylesheet" href="css/user/index.css">
	<link rel="stylesheet" href="css/pagination.css" />
    <script language="javascript" type="text/javascript" src="js/user/jquery-1.8.3.min.js"></script>
    <script language="javascript" type="text/javascript" src="js/user/index.js"></script>
    <title>联系方式</title>
</head>
<body>
<!--top-->
<div class="contact_main">
    <div class="contact_main_title">
        <p>联系方式</p>
    </div>
    <div class="contact_main_cont">
        <div class="contact_main_cont_inp">
            <p><input type="text" placeholder="请输入关键词" /><input type="button" value="查询" /></p>
        </div>
        <div class="contact_main_cont_from">
            <div class="contact_main_cont_from_title">
                <ul>
                    <li class="contact_check_time">查看时间</li>
                    <li class="contact_check_name">项目名称</li>
                    <li class="contact_check_user">联系人</li>
                    <li class="contact_check_way">联系方式</li>
                    <div class="cleardiv"></div>
                </ul>
            </div>
            <div class="contact_main_cont_from_cont">
                <div class="contact_main_cont_from_cont_box">

                </div>
                <div class="pagination clearfix">
                    <div id="page" class="m-pagination"></div>
                </div>
            </div>
        </div>
    </div>

</div>
<!--main-->

<script>
    $(document).ready(function(){
        var startTime;
        var endTime;
        var pageSize;
        var pageIndex;
        var pageSize;
        $.ajax({
            url:"lt/user/investerOptProjList",
            data:{startTime:startTime,endTime:endTime,pageSize:pageSize,pageIndex:pageIndex,pageSize:pageSize},
            type:"get",
            success:function(data){
                if(data.result != 0){
                    handlerError(data);
                }else{
                    var focusData = data.data;
                    for(var i = 0 ; i<focusData.length; i++){
//                            alert(shuju[i].accountBalance)
                        var html="<ul>" +
                                "<li class='contact_check_time'>"+focusData[i].dateTime+"</li>" +
                                "<li class='contact_check_name'>"+focusData[i].projName+"</li>" +
                                "<li class='contact_check_user'>"+focusData[i].contactor+"</li>" +
                                "<li class='contact_check_way'>"+focusData[i].phone+"</li>" +
                                "<div class='cleardiv'></div>" +
                                "</ul>";
                        $(".contact_main_cont_from_cont_box").append(html);
                        $(".contact_main_cont_from_cont_box ul:odd").css("background","#f9f9f9");
                    }
                }
            }
        });
        var $pagination = $('<div></div>');
        $pagination.addClass("m-pagination").attr("id","page");
        $(".person-content").append($("#page"));
        $("#page").pagination({
            pageSize: 1,
            total: 1000,
            pageBtnCount: 6,
            showFirstLastBtn:false,
            prevBtnText:"<",
            nextBtnText:">"
        });
        $("#page").on("pageClicked", function (event, data) {
            contactPage(data);
        });

//        var projectHtml = $("#project-template").html();
//        var projectTpl= Handlebars.compile(projectHtml);
        var contactPage = function(opts) {
            //remember data
            if(!!window.sessionStorage.getItem("projectJson")){
                var projectJson = window.sessionStorage.getItem("projectJson");
            }
            $.get("lt/user/investerOptProjList", _.extend({}, opts, projectJson),function(data){
            	if(data.result != 0){
                    handlerError(data);
                } else{
                    var projectData = data.data;
                    $(".project-list-show").html(contactPage);
                    $("#page").pagination('setPageSize', data.total);

                    for(var i=0; i < projectData.length; i++) {
                        //环形进度条调用
                        var cricleStyleOne = {
                            backgroundColor: "#fff",//background colour of inner circle
                            fontColor: "#ecb22e",//font color of progress text
                            fontSize: "20px",//font size of progress text
                            radius: 40,//radius of circle
                            progressBarBackground: "#cdcdcd",//background colour of circular progress Bar
                            progressBarColor: "#ecb22e",//colour of circular progress bar
                            progressBarWidth: 10,//progress bar width
                            progressPercent: 0,//progress bar width
                            showText: true //show progress text or not
                        };
                        var cricleStyle = {
                            backgroundColor: "#fff",//background colour of inner circle
                            fontColor: "#ecb22e",//font color of progress text
                            fontSize: "20px",//font size of progress text
                            radius: 40,//radius of circle
                            progressBarBackground: "#cdcdcd",//background colour of circular progress Bar
                            progressBarColor: "#ecb22e",//colour of circular progress bar
                            progressBarWidth: 10,//progress bar width
                            progressPercent: projectData[i].finace_rate,//progress percentage out of 100
                            progressValue: projectData[i].finace_rate,//diplay this value instead of percentage
                            showText: true//show progress text or not
                        };
                        if (projectData[i].finace_rate > 50) {
                            cricleStyleOne.fontColor = "#66b56a";
                            cricleStyleOne.progressBarColor = "#66b56a";
                            cricleStyle.fontColor = "#66b56a";
                            cricleStyle.progressBarColor = "#66b56a";
                        }
                        //第一次随便写，如果只写一遍则不会显示%
                        $("#circlePro" + i).circularloader(cricleStyleOne);
                        //第二次调用显示%
                        $("#circlePro" + i).circularloader(cricleStyle);
                    }
                }
            });
        };
        contactPage();

    })
</script>
<script type="text/javascript" src="js/pagination.js" charset="utf-8"></script>
<script src="js/underscore.min.js"></script>
<!--<script src="js/handlebars-v4.0.5.js"></script>-->
<script src="js/CircularLoader.js"></script>
</body>
</html>